import React from 'react'

// 使用路由表的形式定义路由规则
// 引入路由对应的组件
import Home from '../router6-view-1/Home'
import Category from '../router6-view-1/Category'
import Cart from '../router6-view-1/Cart'
import Mine from '../router6-view-1/Mine'
import Notfind from '../router6-view-1/Notfind'
import Mine1 from '../router6-view-1/Mine1'
import Mine2 from '../router6-view-1/Mine2'
import { useRoutes } from 'react-router-dom'
type Props = {}

export default function Index({ }: Props) {
    const routes = [
        {
            path: '/home',
            element: <Home></Home>
        },
        {
            path: '/category/:id',
            element: <Category></Category>
        },
        {
            path: '/cart',
            element: <Cart></Cart>
        },
        {
            path: '/mine',
            element: <Mine></Mine>,
            children: [
                {
                    path: '',
                    element: <Mine1></Mine1>,
                },
                {
                    path: '/mine/mine1',
                    element: <Mine1></Mine1>,
                },
                {
                    path: '/mine/mine2',
                    element: <Mine2></Mine2>,
                }
            ]
        },
        {
            path: '*',
            element: <Notfind></Notfind>
        }
    ]
    const ele = useRoutes(routes)
    return (
        <>
            {ele}
        </>
    )
}